<template>
	<view>
		<u-navbar :isBack="true"  title-color="#fff" back-icon-color="#fff"
		:background="{background: 'rgba(0,0,0,0)'}" :immersive="true" :borderBottom="false"></u-navbar>
		<view>
			<image :src="topimg" mode="widthFix" style="width: 100%;"></image>
		</view>
		<view style="margin: 60rpx 32rpx;color: #fff;background: rgba(255, 255, 255, 0.6);
		border-radius: 36rpx;border: solid 1px #fff;padding: 30rpx 20rpx;">

			<view>
				<view class="slideshow-image" :style="{backgroundImage: 'url(' + rectanglebg + ')'}"
				style="width: 60%;height: 100rpx;background-size: cover;padding-top: 14rpx;padding-left: 24rpx;">
					<view style="font-size: 36rpx;font-weight: bold;">师傅入驻条件</view>
				</view>
				<view style="color: #FC7404;background: #fff;padding: 24rpx;border-radius: 16rpx;margin-top: -16rpx;">
					<view style="background: #FFEBDF;border-radius: 8rpx;padding: 10rpx 24rpx;">如实填写并提交正确的身份认证信息</view>
					<view style="background: #FFEBDF;border-radius: 8rpx;padding: 10rpx 24rpx;margin-top: 16rpx;">认真选择适合自己的业务工种</view>
					<view style="background: #FFEBDF;border-radius: 8rpx;padding: 10rpx 24rpx;margin-top: 16rpx;">认真阅读入驻协议书</view>
				</view>
			</view>

			<view style="margin-top: 36rpx;">
				<view class="slideshow-image" :style="{backgroundImage: 'url(' + rectanglebg + ')'}"
				style="width: 60%;height: 100rpx;background-size: cover;padding-top: 14rpx;padding-left: 24rpx;">
					<view style="font-size: 36rpx;font-weight: bold;">师傅接单须知</view>
				</view>
				<view style="color: #fff;background: #fff;padding: 24rpx;border-radius: 16rpx;margin-top: -16rpx;">
					<view style="display: flex;font-size: 28rpx;margin-bottom: 24rpx;">
						<view style="background: #FC7404;font-weight: bold;padding: 0rpx 15rpx;height: 40rpx;
						text-align: center;line-height: 40rpx;border-radius: 50%;">1</view>
						<!-- <view>
							<u-avatar text="1" size="40" bg-color="#FC7404"></u-avatar>
						</view> -->
						<!-- <view class="circle">1</view> -->
						<view style="color: #9C4803;margin-left: 16rpx;">
							接单过程中，需要打开语音提醒，当有订单出现时，若不打开语音提醒，将接收不到订单的提醒，从而影响师傅接单
						</view>
					</view>
					<view style="display: flex;font-size: 28rpx;margin-bottom: 24rpx;">
						<view style="background: #FC7404;font-weight: bold;padding: 0rpx 15rpx;height: 40rpx;
						text-align: center;line-height: 40rpx;border-radius: 50%;">2</view>
						<view style="color: #9C4803;margin-left: 16rpx;">
							当师傅收到派单后，必须按照订单上的预约时间准时上门，并按照订单内容开始进行订单服务
						</view>
					</view>
					<view style="display: flex;font-size: 28rpx;margin-bottom: 24rpx;">
						<view style="background: #FC7404;font-weight: bold;padding: 0rpx 15rpx;height: 40rpx;
						text-align: center;line-height: 40rpx;border-radius: 50%;">3</view>
						<view style="color: #9C4803;margin-left: 16rpx;">
							师傅在约定的时间内上门服务，当服务完成后，师傅需要在订单中上传清晰的完工照，以完成平台的验收。
							完工照必须真实，如有作假上传虚假完工照，平台将予以重罚
						</view>
					</view>
				</view>
			</view>

		</view>
		<view>
			<button class="u-reset-button confirm-btn" @tap="toJump('/pages/master/applyinfo')">申请加入</button>
			<view class="safe-area-inset-bottom"></view>
		</view>
		<view style="height: 60rpx;"></view>

	</view>
</template>

<script>
	import configUrl  from '@/utils/config.js';
	// import { userApi } from '@/common/user.js';
	export default {
		name: "FinanceRegister",
		data() {
			return {
				value: '20',
				// topimg: configUrl.appurlImg + '/app/sbanerbg.png',
				topimg:configUrl.appurlImg + '/myBanner/sfrz-bg.png',
				rectanglebg: configUrl.appurlImg + '/app/Rectanglebg.png',

			};
		},
		methods: {
			// 跳转
			toJump(e){
				uni.navigateTo({
					url: e,
				})
				return;
				userApi.queryMasterApply().then(res => {
					if (res == '-1') {
						uni.navigateTo({
						  url: e,
						});
					}else if (res == '-2') {
						uni.showToast({
							title: '请先绑定手机号！',
							duration: 2000,
							icon: "none",
						});
						setTimeout(() => {
							uni.navigateTo({
								url: '/pages/users/MyInfo?action=mobile',
							})
						},2000);
					} else {
						// uni.navigateTo({
						//   url: '/pages/master/result?action=' + res,
						// })
						uni.navigateTo({
						  url: e,
						})
					}
				});
			},
		}
	};
</script>

<style>
	page {
		background: #FE8127 !important;
	}
</style>
<style lang="scss" scoped>
	// @import "static/css/public-custom-form.scss";

	.circle {
	    display: inline-block; /* 行内元素块状化 */
	      width: 30px;
	      height: 30px;
	      font-size: 16px;
	      color: #ffffff; /* 字体颜色 */
	      text-align: center; /* 水平居中 */
	      line-height: 30px; /* 垂直居中 */
	      border-radius: 50%; /* 圆形 */
	      background: #000000; /* 背景色，也可以用url()方法引用背景图片 */
	}

	.confirm-btn {
	  margin: 32rpx;
	  // width: calc(100vw - 64rpx);
	  height: 100rpx;
	  line-height: 100rpx;
	  text-align: center;
	  color: #FC7404;
	  background-color: #fff;
	  // border-radius: 999px;
	  border-radius: 24rpx;
	  &:active {
		background-color: lighten(#fff, 10%);
	  }
	}
</style>
